import * as React from 'react';
import AppBar from '@mui/material/AppBar';
import Box from '@mui/material/Box';
import Toolbar from '@mui/material/Toolbar';
import Typography from '@mui/material/Typography';
import IconButton from '@mui/material/IconButton';
import MenuIcon from '@mui/icons-material/Menu';
import SwitchToggle from './SwitchToggle';

interface IProps {
    title: string;
    setMode: React.Dispatch<React.SetStateAction<string>>;
}

export default function HeadBar(props: IProps) {
  return (
    <Box sx={{ flexGrow: 1 }}>
      <AppBar position="static">
        <Toolbar>
            <SwitchToggle setMode={props.setMode}  />
            <Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
            {props.title}
            </Typography>
        </Toolbar>
      </AppBar>
    </Box>
  );
}